$(function () {
	initDataTable();
	showTab(vaPageSetting);
	showButton();
	getSaveDataByWho();
	loadZone();
	prepareData();
});

// check button click
function checkButtonClick(button) {
	if(button == "btn_save_step1"){
		document.getElementById("btn_save_step1").value = "yes";
	}else if (button == "btn_findRoute_step2"){ // ค้นหาเส้นทาง
		document.getElementById("btn_findRoute_step2").value = "yes";
	} else if (button == "btn_save_step2") { // ยืนยันการอัพเดทข้อมูลการอ่านน้ำ
		document.getElementById("btn_save_step2").value = "yes";
	} else if (button == "btn_saveall_step2"){ // ยืนยันการอัพเดทข้อมูลการอ่านน้ำทุกเขต
		document.getElementById("btn_saveall_step2").value = "yes";
	} else if (button == "btn_cancel_prepareDataStep1"){
		document.getElementById("btn_cancel_prepareDataStep1").value = "yes";
	}
}

function initDataTable() {
	$('#prepareDataTable').dataTable( {
		"oLanguage": {
            "oPaginate": {
                          "sFirst": "หน้าแรก",// ปุ่มกลับมาหน้าแรก
                          "sLast": "หนัาสุดท้าย",//ปุ่มไปหน้าสุดท้าย
                          "sNext": "ถัดไป", //ปุ่มหน้าถัดไป
                          "sPrevious": "ก่อนหน้า" // ปุ่ม กลับ
                        	  },
             "sLengthMenu": "แสดง _MENU_ รายการ ต่อหน้า",  
             "sZeroRecords": "ไม่พบข้อมูลที่ค้นหา", 
             "sInfo": "แสดง _START_ ถึง _END_ จากทั้งหมด _TOTAL_ รายการ",
             "sEmptyTable": "ไม่พบรายการข้อมูล",
             "sLoadingRecords": "ระบบกำลังประมวลผล กรุณารอซักครู่",
             "sProcessing": "ประมวลผลข้อมูล",
             "sInfoEmpty": "ไม่พบรายการข้อมูลที่แสดง",
             "sInfoFiltered": "(จากทั้งหมด _MAX_ รายการ)",  
             "sSearch": "ค้นหา :"
        },
        "aoColumns" : [ {"sTitle": "ลำดับ", sClass: "alignCenter", sWidth: '10%', "bSortable": false},
		                {"sTitle": "เขต", sWidth: '25%', "bSortable": false},
		                {"sTitle": "เส้นทาง", sWidth: '25%', "bSortable": false},
		                {"sTitle": "ชื่อพนักงาน", sWidth: '40%', "bSortable": false},
		               ],
		//"bPaginate": false, // paging ด้านล่างขวา
		//"bLengthChange": false, // เลือกจำนวนแสดงด้านบนซ้าย
		//"bInfo": false, // ข้อความด้านล่างซ้าย
		//"bScrollCollapse": true,
		"sPaginationType" : "full_numbers",// แสดงตัวแบ่งหน้า
		"bLengthChange": false, // แสดงจำนวน record ที่จะแสดงในตาราง
		"iDisplayLength": 10, // กำหนดค่า default ของจำนวน record 
		"bScrollCollapse": true,
		"aLengthMenu": [
		                [10, 25, 50, 100, -1], // จำนวนที่แสดงในตาราง
		                [10, 25, 50, 100, "ทั้งหมด"] // จำนวนที่ให้เลือก
		 ],
	});
}

function prepareData() {
	if (vaPrepareStatus == "success") {
		showTab("2");
		$('#myModalMessageStep1').modal('show'); // pop up after complete preparation
	} else if (vaPrepareStatus == "fail") {
		showTab("1");		
		$('#myModalErrorMessageStep1').modal('show'); // show modal error
	}
}

// select tab to show
function showTab(vaPageSetting) {
	// show tab
	if (vaPageSetting == "1") {
		// default setting
	} else if (vaPageSetting == "2") {
		// set to display tab 2
		$('#start_work').removeClass('active');
		$('#prepare_data').addClass('active');
		$('.form-step').hide();
		$('#form-2').show();
	} else if (vaPageSetting == "3") {
		// set to display tab summary
		$('#start_work').removeClass('active');
		$('#confirm_receive').addClass('active');
		$('.form-step').hide();
		$('#form-3').show();
	}
}

// check it will show button or not
function showButton() {
		if (vaShowButton == "yes") {
			// enable button in step 1
			document.getElementById("confirmPrepareData").innerHTML = 
				"<div class='form-group mt-20 clearfix search-footer no-radius' "
				+ "style='margin-left:-10px; margin-right:-10px'>	<div class='col-sm-offset-4 col-sm-7'> "
				+ "<button type='button' style='margin-right: 2%;' class='btn btn-primary' data-toggle='modal' data-target='#myModal-confirm-step1' >" 
				+ "<i class='fa fa-floppy-o'></i> บันทึก </button><button type='button' disabled class='btn btn-danger' data-toggle='modal' "
				+ "data-target='#' id='btn_cancle_prepareData' name='btn_cancle_prepareData'><i class='glyphicon glyphicon-floppy-remove'></i> ยกเลิก</button></div></div>";
			// disabled button in step 2
			document.getElementById("button_findRoute").innerHTML = "<button type='submit' disabled class='btn btn-primary' " +
					"onclick=\"checkButtonClick('btn_findRoute_step2');\"><i class='fa fa-search'></i> ค้นหา</button>";
			document.getElementById("button_saveReaderInZone").innerHTML = "<button type='button' disabled class='btn btn-primary' " +
					"data-toggle='modal' data-target='#myModalMessageStep2ConfirmZone' ><i class='fa fa-floppy-o'></i> บันทึกเขต  </button>";
			document.getElementById("button_saveReaderInAllZone").innerHTML = "<button type='button' disabled class='btn btn-primary' " +
					"data-toggle='modal' data-target='#myModal-confirm-step2' ><i class='fa fa-floppy-o'></i> ยืนยันทุกเขต </button>";
		} else { 
			// disable button in step 1
			if ( vaButtonCancel == "hide"){
				document.getElementById("confirmPrepareData").innerHTML = 
					"<div class='form-group mt-20 clearfix search-footer no-radius' "
					+ "style='margin-left:-10px; margin-right:-10px'>	<div class='col-sm-offset-4 col-sm-7'> "
					+ "<button type='button'style='margin-right: 2%;' disabled class='btn btn-primary' data-toggle='modal' data-target='#myModal-confirm-step1' >" 
					+ "<i class='fa fa-floppy-o'></i> บันทึก </button><button type='button' disabled class='btn btn-danger' data-toggle='modal' "
					+ "data-target='#myModal-confirm-cancel' id='btn_cancle_prepareData' name='btn_cancle_prepareData'><i class='glyphicon glyphicon-floppy-remove'></i> ยกเลิก</button></div></div>";
			} else {
				document.getElementById("confirmPrepareData").innerHTML = 
					"<div class='form-group mt-20 clearfix search-footer no-radius' "
					+ "style='margin-left:-10px; margin-right:-10px'>	<div class='col-sm-offset-4 col-sm-7'> "
					+ "<button type='button'style='margin-right: 2%;' disabled class='btn btn-primary' data-toggle='modal' data-target='#myModal-confirm-step1' >" 
					+ "<i class='fa fa-floppy-o'></i> บันทึก </button><button type='button'  class='btn btn-danger' data-toggle='modal' "
					+ "data-target='#myModal-confirm-cancel' id='btn_cancle_prepareData' name='btn_cancle_prepareData'><i class='glyphicon glyphicon-floppy-remove'></i> ยกเลิก</button></div></div>";
			}
			// enable button in step 2
			document.getElementById("button_findRoute").innerHTML = "<button type='submit' class='btn btn-primary' " +
					"onclick=\"checkButtonClick('btn_findRoute_step2');\"><i class='fa fa-search'></i> ค้นหา</button>";
			document.getElementById("button_saveReaderInZone").innerHTML = "<button type='button' class='btn btn-primary' " +
					"data-toggle='modal' data-target='#myModalMessageStep2ConfirmZone' onclick=\"setZoneLabelInModal();\"> " +
					"<i class='fa fa-floppy-o'></i> บันทึกเขต  </button>";
			document.getElementById("button_saveReaderInAllZone").innerHTML = "<button type='button' class='btn btn-primary' " +
					"data-toggle='modal' data-target='#myModal-confirm-step2' ><i class='fa fa-floppy-o'></i> ยืนยันทุกเขต </button>";
		}
}

function setZoneLabelInModal() {
	var voInput = document.getElementById('inputZone');
    document.getElementById("labelZone").innerHTML = voInput.options[voInput.selectedIndex].text;
}

// get who click to prepared data
function getSaveDataByWho() {
	$.getJSON('CS31000Srvl', { save_by: "yes", url_address:$("#url_address").val(), agent_browser:$("#agent_browser").val() }, function(result) {
		document.getElementById("saveDataBy").innerHTML = result.messages[0];
	});
}

function loadZone() {
	$.getJSON('CS31000Srvl', { zone_rsm: "yes", url_address:$("#url_address").val(), agent_browser:$("#agent_browser").val() }, function(result) {
		var options = '';
		options += '<option value="0">-- เลือกเขต --</option>';
		for (var i = 0; i < result.values.length; i++) {
			options += '<option value="' + result.values[i] + '">' + result.messages[i] + '</option>';
		}
	    $("select#inputZone").html(options);
	    // set zone selected
	    if (vnZoneId != "") {
			document.getElementById("inputZone").value = vnZoneId;
		}
	});
}

